<template>
  <div>
    <van-nav-bar
      title="设置昵称"
      left-text=""
      right-text="完成"
      left-arrow
      @click-left="router.go(-1)"
      @click-right="changeOk"
    />
    <el-Input clearable v-model="nickname" placeholder="请输入昵称"></el-Input>
  </div>
</template>

<script lang="ts" setup>
import { ElMessage } from 'element-plus'
import { request } from '../../axios/request'
import { ref } from 'vue'
import { useRouter } from 'vue-router'

// 路由跳转
const router = useRouter()

// 获取输入昵称
const nickname:any = ref('')

// 拿取userId, sessionId
  const userId= JSON.parse(localStorage.getItem('userId') || '') // 示例用户 IDzzz
  const  sessionId= JSON.parse(localStorage.getItem('sessionId') || '') // 示例会话 ID
  
// 修改昵称
const user = JSON.parse(localStorage.getItem('result')|| '') 
nickname.value = user.nickName

// 修改性别
const changeOk = async () => {
  await request
    .put(
      '/api/health/user/verify/v1/modifyNickName',
      {
        nickName: nickname.value as string
      },
      {
        headers: {
          userId: userId as number,
          sessionId: sessionId as string,
          'Content-Type': 'application/x-www-form-urlencoded'
        }
      }
    )
    .then((res) => {
      console.log(res)
      ElMessage.success('修改成功')
      user.nickName = nickname.value
      localStorage.setItem('result', JSON.stringify(user))
      router.push('/my')
    })
}
</script>